<template>
  <div class="aboutList">
    <div class="aboutBanner">
      <img src="../assets/images/newsBanner.jpg" alt="">
    </div>
    <div class="aboutMenu">
      <div class="aboutTop">
        <ul class="w-1100 productMenu">
          <li v-for="(item,index) in tabs" :class="{active:index == num}" @click="tab(index)" :key="item.index">{{ item }}</li>
        </ul>
        <div class="tabCon">
          <div class="crumbs w-1100">
            <span>General Situation</span> /
            <span class="crumbsActive" v-for="(itemCon,index) in crumbs" v-show=" index == num" :key="itemCon.index">{{ itemCon }}</span>
          </div>
          <div class="tabBox" v-show=" 0 == num">
            <div class="w-1100">
              <p class="xian"></p>
            </div>
            <div class="w-1100 itemCon">
              <ul class="newsList clear">
                  <li class="clear">
                      <p class="newsImg">
                          <img src="../assets/images/newsImg.jpg" alt="">
                      </p>
                      <div class="newsCon">
                          经过5个月的紧张筹备工作，未来家智能科技（昆山）有限公司的微信公众号就要在2019年春节期间正式投放使用，以O2O模式的互联网服务将会对众多企业和家庭提供服务，未来家的营运模式打破了传统服务方式，为越来越多的用户提供快捷便利的保障服务，为普通用户提高了生活品质。降本增效，高效服务是未来家对合作方及用户服务的最大亮点，未来家的微信公众号投放使用及APP上线，用户可以在线上直接下单解决生活中的琐事烦恼，未来家智能管家服务也会得到越来越多用户的青睐。未来家立足于昆山，通过公司全体成员的匠心精神服务于广大用户，让更多的用户享受到未来家带来的红利。
                      </div>
                  </li>
              </ul>
            </div>
            <div class="newsMore w-1100">
                <button>查看更多...</button>
            </div>
          </div>
          <div class="tabBox" v-show=" 1 == num">
            <div class="w-1100">
              <p class="xian"></p>
            </div>
            <div class="w-1100 itemCon">
              <ul class="newsList clear">
                  <li class="clear line" @click='newsDetail()'>
                      <p class="newsImg2">
                          <img src="../assets/images/newsImg2.jpg" alt="">
                      </p>
                      <div class="newsCon2">
                          <h3>未来的全国智能社区该如何发展？</h3>
                          <p>智慧社区指的是以住宅小区为平台，将网络通信、智能家电、家庭安防、物业服务、社交服务、增值服务等一体化的和谐低碳的社区。由于智慧社区本身代表了一种较现代的生活方式，受建设成本和消费水平影响较大，因此，智慧社区的发展还很不平衡，目前我国智慧社区普及率还比较低只占了全国的40%，那么，智慧社区未来该如何发力?</p>
                      </div>
                  </li>
                  <li class="clear line" @click='newsDetail()'>
                      <p class="newsImg2">
                          <img src="../assets/images/newsImg3.jpg" alt="">
                      </p>
                      <div class="newsCon2">
                          <h3>未来的全国智能社区该如何发展？</h3>
                          <p>智慧社区指的是以住宅小区为平台，将网络通信、智能家电、家庭安防、物业服务、社交服务、增值服务等一体化的和谐低碳的社区。由于智慧社区本身代表了一种较现代的生活方式，受建设成本和消费水平影响较大，因此，智慧社区的发展还很不平衡，目前我国智慧社区普及率还比较低只占了全国的40%，那么，智慧社区未来该如何发力?</p>
                      </div>
                  </li>
                  <li class="clear line" @click='newsDetail()'>
                      <p class="newsImg2">
                          <img src="../assets/images/newsImg4.jpg" alt="">
                      </p>
                      <div class="newsCon2">
                          <h3>未来的全国智能社区该如何发展？</h3>
                          <p>智慧社区指的是以住宅小区为平台，将网络通信、智能家电、家庭安防、物业服务、社交服务、增值服务等一体化的和谐低碳的社区。由于智慧社区本身代表了一种较现代的生活方式，受建设成本和消费水平影响较大，因此，智慧社区的发展还很不平衡，目前我国智慧社区普及率还比较低只占了全国的40%，那么，智慧社区未来该如何发力?</p>
                      </div>
                  </li>
                  <li class="clear line" @click='newsDetail()'>
                      <p class="newsImg2">
                          <img src="../assets/images/newsImg5.jpg" alt="">
                      </p>
                      <div class="newsCon2">
                          <h3>未来的全国智能社区该如何发展？</h3>
                          <p>智慧社区指的是以住宅小区为平台，将网络通信、智能家电、家庭安防、物业服务、社交服务、增值服务等一体化的和谐低碳的社区。由于智慧社区本身代表了一种较现代的生活方式，受建设成本和消费水平影响较大，因此，智慧社区的发展还很不平衡，目前我国智慧社区普及率还比较低只占了全国的40%，那么，智慧社区未来该如何发力?</p>
                      </div>
                  </li>
              </ul>
            </div>
            <div class="newsMore w-1100">
                <button>查看更多...</button>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="mask" v-show='reveal' @click="close()"></div>
    <div class="popup" v-show='reveal'>
      <div class="popupBox">
        <span class="close" @click="close()">
          <img src="../assets/images/close.png" alt="">
        </span>
        <div class="popupCon">
          <h3>未来的全国智能社区该如何发展？</h3>
          <div class="popupIntro">
            <p>智慧社区指的是以住宅小区为平台，将网络通信、智能家电、家庭安防、物业服务、社交服务、增值服务等一体化的和谐低碳的社区。由于智慧社区本身代表了一种较现代的生活方式，受建设成本和消费水平影响较大，因此，智慧社区的发展还很不平衡，目前我国智慧社区普及率还比较低只占了全国的40%，那么，智慧社区未来该如何发力?</p>
            <p>一二线城市发力智慧社区，聚焦2个维度</p>
            <p>2017年以来，从北上广等一线城市到南京、杭州、成都等二线新贵，纷纷启动智慧社区建设。这一轮智慧社区建设将利用物联网、无人化等高新技术，加强社区资产、能耗及治安管理，可以解决社会服务与管理工作中的实际问题，为社区居民打造一个节能、环保、平安的生活环境。那么，智慧社区建设应当从哪些方面入手呢?</p>
            <p>1. 选择视频门禁等基础功能</p>
            <p>当前，多数社区选择了以视频门禁系统为核心，增加智慧物业、智慧消防、电商平台等功能。实现人们提高社区生活质量的要求，为业主提供更佳的“互联网+”体验与生活服务。据悉，互联网公司例如小米、华为、亚马逊、苹果等都在发力AI技术及应用，包括国内外的传统企业例如海尔、三星等也在探索硬件与人工智能的结合应用，但现阶段各企业只是通过硬件为用户服务，未来的方向一定是用硬件感知用户。</p>
            <p>2. 坚持"1个中心+N个应用"模式</p>
            <p>“智慧社区”与传统社区不同的创新点所在，就是智慧社区将整合社区内的各类信息系统和资源，通过构建统一的社区信息平台，应用各种信息化手段加强社区信息化管理，丰富和改善社区居民生活服务。智慧社区的实现主要依托1个中心+N个应用， “1个中心”即社区或街道级智慧社区大数据平台，“N个应用”如智能门禁、电商平台、智慧物业、智慧办事、智慧停车、智慧消防等子系统。</p>
          </div>
          <!-- <div class="popupbtn">
            <img src="../assets/images/left.png" alt="">
            <img src="../assets/images/right.png" alt="">
          </div> -->
        </div>
        <div class="popupTab">
          <p>上一篇：<a href="">2017年智慧社区发展趋势：体现“四化”</a></p>
          <p>下一篇：<a href="">2017年智慧社区发展趋势：体现“四化”</a></p>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      tabs: [' 公司动态 ', ' 业界新闻 '],
      num: 0,
      crumbs: [' 公司动态 ', ' 业界新闻 '],
      reveal: false
    }
  },
  methods: {
    tab (index) {
      this.num = index
    },
    newsDetail (index) {
      this.reveal = true
    },
    close () {
      this.reveal = false
    }
  }
}
</script>

<style lang="scss" scoped>
@import "../assets/style/news/News.scss";
//面包屑样式
@import "~@/assets/style/special.scss";
</style>
